<%@ page import="java.util.List" %>
<%@ page import="com.google.appengine.api.datastore.DatastoreServiceFactory" %>
<%@ page import="com.google.appengine.api.datastore.DatastoreService" %>
<%@ page import="com.google.appengine.api.datastore.Query" %>
<%@ page import="com.google.appengine.api.datastore.Entity" %>
<%@ page import="com.google.appengine.api.datastore.FetchOptions" %>
<%@ page import="com.google.appengine.api.datastore.Key" %>
<%@ page import="com.google.appengine.api.datastore.KeyFactory" %>
<%@ page import="com.google.appengine.api.datastore.Query" %>
<%@ page import="com.google.appengine.api.datastore.Query.FilterOperator" %>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<!-- Redirect to the login page if there is no session created -->
<%
if (session.getAttribute("username") == null) {
	response.sendRedirect("/login.jsp");
}

DatastoreService datastore = DatastoreServiceFactory.getDatastoreService();
Key accountKey = KeyFactory.createKey("Accounts", "accountName");

Query query = new Query("Account", accountKey).addSort("username", Query.SortDirection.ASCENDING);
List<Entity> accounts = datastore.prepare(query).asList(FetchOptions.Builder.withLimit(100));

Integer TotalUserAccounts=0;
Integer TotalLockedAccounts=0;
Integer TotalUnlockedAccounts=0;
Integer TotalAdminAccounts = 0;
Integer TotalNormalAccounts = 0;

//COUNTING USER ACCOUNT STATISTICS
for (Entity UserAccounts: accounts) {
		TotalUserAccounts++;
		if(UserAccounts.getProperty("lockStatus").equals("locked"))
			TotalLockedAccounts++;
		if(UserAccounts.getProperty("account_type").equals("admin"))
			TotalAdminAccounts++;
	}

TotalUnlockedAccounts = (Integer)(TotalUserAccounts - TotalLockedAccounts);
TotalNormalAccounts = (Integer) (TotalUserAccounts - TotalAdminAccounts);
%>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
		 <title>Administration Panel | Media Vault</title>
	
		<!--icon-->
		<link rel="icon" href="images/mv.ico" type="">
		<!--CSS-->
        <link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
         <link rel="stylesheet" href="css/admin.css" type="text/css" media="screen"/>
        <link href="css/TableStyleCat.css" rel="stylesheet" media="all" />

		<!--Ajax Scripts-->
		<script type="text/javascript" src="js/AjaxCreateNewAccount.js"></script>
		<script type="text/javascript" src="js/AjaxDeleteAccount.js"></script>
		<script type="text/javascript" src="js/AjaxViewUserAccount.js"></script>
		<script type="text/javascript" src="js/AjaxSearch.js"></script>
		<script type="text/javascript" src="js/AjaxAccountStatus.js"></script>
		
		<!--Java Scripts-->
		
    </head>
    <body>
    	<div style="float:right;">
    		<!-- Login Status Bar -->
    		<jsp:include page="loginStatusBar.jsp" />
    	</div>
    	
    	<div class="header" style="width:800px; margin-bottom: 30px;">
				<h1>Administration Panel</h1>
		</div>
		
		<div id="admin_body">
			<div id="system_stats">
				<legend>System Statistics</legend>
				<p>Total System Space : <label>0 MB</label></p>
				<p>Total Space Used : <label>0 MB</label></p>
				<p>Total Free Space : <label>0 MB</label></p>
			</div>
			
			<div id="user_stats">
				<legend>User Accounts Statistics</legend>
				<div style="float:left; clear:right; margin-right:80px;">
				<p>Total Number of Users : <label><%=TotalUserAccounts %></label></p>
				<p>Total Number of Unlocked Users : <label><%=TotalUnlockedAccounts %></label></p>
				<p>Total Number of locked Users : <label><%=TotalLockedAccounts %></label></p>
				</div>
				<div style="">
					<p>Total Admin Accounts : <label><%=TotalAdminAccounts %></label></p>
					<p>Total Normal User Accounts : <label><%=TotalNormalAccounts %></label></p>
				</div>
			</div>
			
			<div style="clear:both; border-bottom:1px solid #aaa; margin-bottom:30px;"></div>
			
			<!-- Create a new User -->
			<div id="steps" style="width:100%;">
				<div id="createaccountresponse" style="padding:10px;"></div>
				<div id="create_user_admin_form">
				<form method="post">
                        <fieldset class="steps" style="">
                            <legend style="float:none;">Create New Account</legend>
							<div>
								<img src="images/new_user.png" width="250" height="250" id="right_image"/>
							</div>
							<div>
								<p>
									<label for="email">Email / Username</label>
									<input id="CreateUsername" name="CreateUsername" placeholder="info@mediavault.com" type="email" AUTOCOMPLETE=OFF />
								</p>
								<p>
									<label for="password">Password</label>
									<input id="CreatePassword" name="CreatePassword" type="password" AUTOCOMPLETE=OFF />
								</p>
								<p>
									<label for="password">Password Confirmation</label>
									<input id="CreatePassword_confirmation" name="CreatePassword_confirmation" type="password" AUTOCOMPLETE=OFF />
								</p>
							</div>
							<div>
								<p>
									<label for="name">First Name</label>
									<input id="firstName" name="firstName" type="text" AUTOCOMPLETE=OFF />
								</p>
								<p>
									<label for="name">Last Name</label>
									<input id="lastName" name="lastName" type="text" AUTOCOMPLETE=OFF />
								</p> 
								<p>
					        		<label>User Role</label>
					        		<select name="user_role" id="user_role">
					        			<option value="admin">Administrator</option>
					        			<option value="user">Normal User</option>
					        		</select>
		        				</p>
								<p class="submit" style="float:right;">
									<button id="Create" type="button" onClick="ajaxCreateNewAccount()">Create</button>
									<button id="reset" type="reset">Clear</button>
								</p>
							</div>
                        </fieldset>
					</form>
				</div>
			</div>
			
			<div style="clear:both; border-bottom:1px solid #aaa; margin-bottom:30px;"></div>
			
			<div id="search">
				<div style="margin-bottom:20px;"><legend class="admin_body">Search Users</legend></div> 
				<form name="" method="get">
					<label for="keyword" style="width:300px;">Enter Username / First Name / Last Name</label> 
					<input type="text" placeholder="Search User" id="keyword" name="keyword" style="font-size: medium;" onkeyup="ajaxSearchUsersAdmin()" />		
					<button type="button" id="btnSearch" name="btnSearch" style="display: inline;" onClick="ajaxSearchUsersAdmin()">
						<img alt="" src="images/magnifying_glass.png" style="width:15px; height: 15px;">
					</button>
					<button type="button" id="btnSearchAll" style="display: inline;" onclick="ajaxViewUserAccount()">View All Users</button>
				</form>
				<div id="ajaxrespondAreaAdminUserSearch" style="paddin:10px;"></div>
			</div>
		</div>
    </body>
</html>